﻿<script lang="ts" setup>
import { ref } from 'vue'
import { Empty } from 'ant-design-vue'
import { getEnumDisplayName } from '@/utils/enum'
import { formatToDateTime } from '@/utils/dateUtil'
import useCol from '@/hooks/system/useCol'
import { useDrawer } from '@/hooks/system/useDrawer'

defineProps({
  isItem: { type: Boolean, default: false },
  itemData: Object
})
const { getBindColumn } = useCol()
</script>

<template>
  <div :class="['detail-wrapper', { isChild: isItem }]">
    <a-card class="basic-content">
      <a-descriptions v-bind="getBindColumn">        
        <a-descriptions-item label="描述">{{
          itemData?.description
        }}</a-descriptions-item>
        <a-descriptions-item label="检修人">{{
          itemData?.overhauler
        }}</a-descriptions-item>
        <a-descriptions-item label="联系方式">{{
          itemData?.phone
        }}</a-descriptions-item>
        <a-descriptions-item label="维修日期">{{
          formatToDateTime(itemData?.repairDate)
        }}</a-descriptions-item>
        <a-descriptions-item label="创建日期">{{
          formatToDateTime(itemData?.createdDate)
          }}</a-descriptions-item>
      </a-descriptions>
    </a-card>
  </div>
</template>

<style lang="less" scoped>
.detail-wrapper {
  .ant-card {
    margin: 24px;

    &:last-child {
      margin-bottom: 0;
    }
  }

  .basic-content {
    margin: 0;
    border-radius: 0;
    border: 0;

    :deep(.ant-card-body) {
      padding: 0;
    }
  }

  :deep(.ant-card-head) {
    padding-left: 0;

    &-title {
      font-weight: 600;
    }
  }

  :deep(.ant-descriptions) {
    tbody > tr:last-child td {
      padding-bottom: 0;
    }
  }
}
</style>
